<#import "../common/layout.ftl" as layout/>
<#import "../common/dataTables.ftl" as dataTables/>
<#import "../common/modern-forms.ftl" as mform/>
<#import "../common/modal.ftl" as modal/>

<!DOCTYPE html>
<html>
<@layout.head title="字典管理">
    <@dataTables.head/>
    <@dataTables.buttons_head/>
    <@dataTables.select_head/>
    <@dataTables.fixedHeader_head/>
    <@mform.head/>
    <@select.head/>

</@layout.head>
<body>
<@layout.page>
<div class="main-box">

    <div class="content">

        <!-- 按钮 -->
        <div id="btnGroup" class="btn-group">
            <button type="button" class="btn btn-blue btn-sm"
                    onclick="javascript:refreshData();">
                <i class="fa fa-refresh"></i> 刷新
            </button>
            <button id="btnAddTopMenu" type="button" class="btn btn-blue btn-sm" style="margin-left: 5px;"
                    onclick="javascript:newdetail();">
                <i class="fa fa-plus"></i> 新增
            </button>
            <button id="btnAddTopMenu" type="button" class="btn btn-blue btn-sm" style="margin-left: 5px;"
                    onclick="javascript:editdetail();">
                <i class="fa fa-edit"></i> 修改
            </button>
            <button id="btnAddTopMenu" type="button" class="btn btn-blue btn-sm" style="margin-left: 5px;"
                    onclick="javascript:deldetail();">
                <i class="fa fa-minus"></i> 删除
            <#--</button>-->

        </div>

        <div id="btnGroup1" class="btn-group1" style="position: absolute;margin-top: 7px">
            <select id="typeS" name="typeS" label="状态" style="width: 150px ;">
                <#list constType as item>
                    <option value="${item.code}">${item.name}</option>
                </#list>
            </select>
        </div>
        <!-- 表格 -->
        <@dataTables.commonTable id="mainTable"/>
    </div>
</div>

<!-- 弹出窗 -->
    <@modal.editModal id="modal-detail" buttonId="btndetailSave" width="600px">
        <@mform.container  id="editForm">
            <@mform.group name="表单" >
            <input id="id" name="id" type="hidden"/>
            <input id="code" name="code" type="hidden"/>
            <#--<@mform.input_text id='type' name='type' size=12 label='常量类型' placeholder='常量类型' icon='fa-edit' />-->
                <@mform.select2 id='type' name='type' label="常量类型"  size=12>
                <option value="">请选择</option>
                    <#list constType as item>
                    <option value="${item.code}">${item.name}</option>
                    </#list>
                </@mform.select2>
                <@mform.input_text id='name' name='name' size=12 label='名称' placeholder='名称' icon='fa-edit' />
            <#--<@mform.input_text id='state' name='state' size=12 label='状态' placeholder='状态' icon='fa-edit' />-->
                <@mform.select2 id='state' name='state' label="状态"  size=12>
                <option value="" selected="ture">请选择</option>
                    <#list state as item>
                    <option value="${item.code}">${item.name}</option>
                    </#list>
                </@mform.select2>
                <@mform.input_text id='remark' name='remark' size=12 label='备注' placeholder='备注' icon='fa-edit' />
            </@mform.group>

        </@mform.container>

    </@modal.editModal>


</@layout.page>
<@layout.foot>
    <@dataTables.foot/>
    <@dataTables.buttons_foot/>
    <@dataTables.select_foot/>
    <@dataTables.fixedHeader_foot/>
    <@mform.foot/>
<script src="${request.contextPath}/assets/js/jquery.serializejson.min.js?v=3653060703"></script>
<script type="text/javascript">

    var state = {
        <#list state as item>
            "${item.code}": "${item.name}",
        </#list>}
    var columns = [
        // {'sWidth': '120px', 'title': 'id', 'data': 'id'},
        //{'sWidth': '120px', 'title': '常量类型', 'data': 'type'},
        {'sWidth': '120px', 'title': '编码', 'data': 'code'},
        {'sWidth': '120px', 'title': '名称', 'data': 'name'},
        {'sWidth': '120px', 'title': '状态', 'data': 'state'},
        {'sWidth': '120px', 'title': '拼音码', 'data': 'pym'},
        {"sWidth": "120px", "title": "新增时间", "data": "createTime"},
        {"sWidth": "120px", "title": "修改时间", "data": "updateTime"},
        {'sWidth': '120px', 'title': '备注', 'data': 'remark'}

    ]

    var mainTable = $('#mainTable').winningTable({
        columns: columns,
        pageLength: 10,
        fixedHeader: false,
        searching: true,
        ordering: true,
        buttons: [

        ],
        createdRow: function (row, data, dataIndex) {

            if (data.state == "109002") {
                $('td:eq(3)', row).html("财务人员");
            }
            if (data.state == "109003") {
                $('td:eq(3)', row).html("业务人员");
            }
        }, "rowCallback": function (row, data, index) {
            $('td', row).eq(2).html(state[data.state]);
        }
    });


    function newdetail() {
        $('#modal-detail').find(".modal-title").text('新增');
        clearForm($('#modal-detail'));
        $("#btndetailSave").unbind();
        $("#btndetailSave").click(savedetail);
        $('#modal-detail').modal();
    }

    function editdetail() {
        var datas = mainTable.getSelectedDatas();
        if (datas == null || datas.length == 0 || datas.length > 1) {
            swal("错误", "请选择一行数据", "error");
            return;
        }
        var $modal = $("#modal-detail");
        $modal.find(".modal-title").text("修改");
        clearForm($modal);
        var data = datas[0];
        var type = data.type;
        initFormItemData($("#editForm"), data);
        $modal.find("#type").val(type);
        // $("#type").val(type);
        $modal.find("#select2-type-container").html($modal.find("#type").find("option:selected").text());
        $modal.modal();
        $("#btndetailSave").unbind();
        $("#btndetailSave").click(savedetail);
    }

    function refreshData() {
        var type = $("#typeS").val();
        var params = {
            datas: JSON.stringify({
                type: type,
            })
        };
        mainTable.queryData("${request.contextPath}/manage/pm-const/queryList/", params);
    }

    refreshData();
    $("#typeS").bind("change", refreshData);


    function savedetail() {
        var pass = validateItemNotNull($("#name"));
        var pass = validateItemNotNull($("#type"));
        var pass = validateItemNotNull($("#state"));
        if (!pass) {
            return;
        }
        swal({
            title: "确定保存",
            text: "是否确定保存此数据",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "是的,确定",
            cancelButtonText: "取消"
        }).then(function (result) {
            if (!result.value)
                return;
            var requestData = $("#modal-detail form").serializeJSON();
            var params = {datas: JSON.stringify(requestData)};
            $.ajax({
                type: 'POST',
                data: params,
                url: '${request.contextPath}/manage/pm-const/save',
                success: function (data) {
                    //成功之后
                    if (data.success) {
                        swal({
                            title: "成功",
                            text: "操作成功!",
                            type: "success",
                            showCancelButton: false,
                            confirmButtonText: "确定"
                        }).then(function (result) {
                            $("#modal-detail").modal('hide');
                            refreshData();
                        });
                    }
                    else {
                        swal("错误", data.errorMsg, "error");
                    }
                },
                error: function (xhr, type) {
                    swal("错误", "系统发生内部错误!请稍后再试!", "error");
                }
            });
        });
    }

    function deldetail() {
        var datas = mainTable.getSelectedDatas();
        if (datas == null || datas.length == 0 || datas.length > 1) {
            swal("错误", "请选择一行数据", "error");
            return;
        }
        var data = datas[0];
        swal({
            title: "确定删除",
            text: "是否确定删除此数据",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "是的,确定",
            cancelButtonText: "取消"
        }).then(function (result) {
            if (!result.value)
                return;
            var requestData = {
                id: data.id
            };
            var params = {datas: JSON.stringify(requestData)};
            $.ajax({
                type: 'POST',
                data: params,
                url: '${request.contextPath}/manage/pm-const/delete',
                success: function (data) {
                    //成功之后
                    if (data.success) {
                        swal({
                            title: "成功",
                            text: "操作成功!",
                            type: "success",
                            showCancelButton: false,
                            confirmButtonText: "确定"
                        }).then(function (result) {
                            refreshData();
                        });
                    }
                    else {
                        swal("错误", data.errorMsg, "error");
                    }
                },
                error: function (xhr, type) {
                    swal("错误", "系统发生内部错误!请稍后再试!", "error");
                }
            });
        });
    }
</script>
</@layout.foot>
</body>
</html>